var path = require( 'path' );
var webpack = require( 'webpack' );
var url = require( 'url-loader' );
var HtmlwebpackPlugin = require( 'html-webpack-plugin' );
var uglifyJsPlugin = webpack.optimize.UglifyJsPlugin;
//定义了一些文件夹的路径
var ROOT_PATH = path.resolve( __dirname );
var APP_PATH = path.resolve( ROOT_PATH, 'src' );
var BUILD_PATH = path.resolve( ROOT_PATH, 'build' );

module.exports = {
    //项目的文件夹 可以直接用文件夹名称 默认会找index.js 也可以确定是哪个文件名字
    entry:     {
        app:     path.resolve( APP_PATH, 'components/angular/app.js' ),
        //添加要打包在vendors里面的库
        vendors: [
            // 'jquery',
            'angular',
            'angular-ui-router'
        ]
    },
    //输出的文件名 合并以后的js会命名为bundle.js
    output:    {
        path:     BUILD_PATH,
        filename: 'bundle.js'
    },
    resolve:   {
        root: [
            path.resolve( 'src/' )
        ] 
    },
    //添加我们的插件 会自动生成一个html文件
    plugins:   [ 
        //这个使用uglifyJs压缩你的js代码
        new webpack.optimize.UglifyJsPlugin( {minimize: true} ),
        //把入口文件里面的数组打包成verdors.js
        new webpack.optimize.CommonsChunkPlugin( 'vendors', 'vendors.js' ),
        new HtmlwebpackPlugin( {
            // title:    'Custom template',
            template: path.resolve( APP_PATH, 'pages/home.html' ), // Load a custom template
            inject:   'body' // Inject all scripts into the body
        } ),
        new uglifyJsPlugin({
            compress: {
                warnings: false
            }
        })
    ],
    devServer: {
        historyApiFallback: true,
        hot:                true,
        inline:             true,
        progress:           true
    },
    // devtool: 'eval-source-map', //启用source-map
    module:    {
        loaders: [
            {test: /\.css$/, loader: "style-loader!css-loader"},
            {test: /.(png|jpg)$/, loader: 'url?limit=8192'},
            {test: /\.html$/, loader: 'raw'},
        ]
    }
};


